<template>
  <div>
    
    <el-table :data="tableData"
              border
              style="width: 100%">
      <el-table-column prop="license_plate_number"
                       label="车牌号"
                       width="200">
      </el-table-column>
      <el-table-column prop="models"
                       label="车型"
                       width="200">
      </el-table-column>
      <el-table-column label="车厢长度"
                       prop="car_length"
                       width="200">
      </el-table-column>
      <el-table-column label="吨位"
                       prop="cargo_weight"
                       width="200">
      </el-table-column>
      <el-table-column label="车架号"
                       prop="chassis_number"
                       width="200">
      </el-table-column>
      <el-table-column label="发动机型号"
                       prop="engine_type"
                       width="200">
      </el-table-column>
    </el-table>
    <el-pagination background
                   layout="prev, pager, next,sizes"
                   :total="total"
                   :page-sizes=[5,10,30,50]
                   page-size="5"
                   @current-change="tiao"
                   @prev-click="syy"
                   @next-click="xyy"
                   @size-change="ydx">
    </el-pagination>
  </div>
</template>
<script>
export default {
  data () {
    return {
      tableData: [],
      editFormVisible: false, //控制编辑页面显示与隐藏
      editForm: {
        license_plate_number:"",
        models:"",
        car_length:"",
        cargo_weight:"",
        chassis_number:"",
        engine_type:""
      },
      total: "1000",
      pageSize:"5",
      currentPage: "1",
    }
  },
  created () {
    this.getdata()
  },
  inject: ["refresh"],
  methods: {
    getdata () {
      this.$axios.post("/api/freightz/car/" + this.currentPage + "/" + this.pageSize,{})
      .then(res => {
        this.tableData = res.data.data.list;
        this.total = res.data.data.total;
        console.log(res.data.data.list);
      }).catch();
    }, 
     tiao (res) {
      this.currentPage = res;
      this.getdata()
    },
    syy (res) {
      this.currentPage = res;
    },
    xyy (res) {
      this.currentPage = res;
    },
    ydx (res) {
      this.pageSize = res;
    }
  }
}
</script>
